<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>

<%@taglib prefix="s" uri="/struts-tags"%>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/querybuilder.css"/>
<script type="text/javascript" src="js/sql.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
var arr=new Array();
var table_name;
var query;
var query_modified;
$(document).ready(function(){

$("#table0 td ").hover(function(){
	
$(this).css("cursor","hand");	
	
	
	
});// end of table0 td hover
$("#table1 td,#table2 td").live("click",function(){
//alert("alert");
$("td").removeClass();
$("#selected_column").text($(this).text());
$(this).addClass("selected1");

});
	
$("#b1").click(function(){


$('#table1 tr ').each(function() {
    var selectedvalue = $(this).find("td.selected1").html();    

	if(typeof selectedvalue!='undefined')
	{
	//check for undefined
	//now check if table2 already contains the selected field if present dont add it again
	
	$('#table2 tr').each(function() 
    {
	var already_present=$(this).find("td").html();
//alert(already_present);
arr.push(already_present);
	
	
	
	});
	
	
	if(arr.indexOf(selectedvalue)==-1)
	
	{
		
	$("#table2").append("<tr><td>"+selectedvalue+"</td></tr>");
	}

	
	}});
});

$("#b2").click(function(){

$("#table2 td.selected1").remove();


});//end of #b2 click


$("#left_par,#right_par,#and,#or").click(function(){
var content=$("#query_string").val();
content=content+" "+$(this).attr("value")+" ";
$("#query_string").val(content);




});//end of left_par, right_par, and , or

$("#add_to_filter").click(function(){

var filter_text=$("#condition_value").val();
if(filter_text.length==0){
$(".required").text("Required Field");

}
else{
$(".required").text("");
var filter_text_appended=$("#selected_column").text()+" "+$("#condition").val()+" "+filter_text;
var content=$("#query_string").val();
content=content+" "+filter_text_appended+" ";
$("#query_string").val(content);

}


});// end of add_to_filter

$("#sql_query").click(function(){
var query_string=$("#query_string").val();
var interested_fields="";
$("#table2 tr td").each(function(){

interested_fields+=$(this).html()+",";

})
interested_fields=interested_fields.substring(0,interested_fields.length-1);
query=squel.select().from(table_name).field(interested_fields).where(query_string);

//alert(query);

});//end to sql_query click function

$("#table0 td").click(function(){
	
	var data1="lookup_entry="+$(this).text();
	table_name=$(this).text();
	$.getJSON("query_builder_lookup.action",data1,process_json);
	$("#table0 td").css("background-color","FFFFFF");
	$(this).css("background-color","FFCCFF");
	
});// end of table0 td click function
function process_json(data,status){
	$("#table1 tr:not(.header),#table2 tr:not(.header)").remove();

	$("#query_string").val("");
	for(var i=0;i<data.keys.length;i++){
		$("#table1").append("<tr><td>"+data.keys[i]+"</td></tr>");
	}
}


$("#save_button").click(function(){
	$("input[type='button']").attr("disabled",true);
	$("#sql_query").trigger("click");
    query_modified="query="+encodeURIComponent(query);
    //alert(query_modified);
	$.post("save_query.action",query_modified,saved_status,'json');
	$("body").slideDown();
	$("#status").remove();
	$("#paragraph").before("<div id='status' align='center'> <img src='images/ajax-loader.gif'/></div>");
	
	
});// end of save_button click

function saved_status(data,status){
	for(var i=0;i<data.messages.length;i++){

		$("#status").html("<h3>"+data.messages[i]+"</h3>");
		if(data.messages[i]=="Query saved successfully")
		$("#saved_queries").append("<option>"+query+"</option>");
		
	}
	
	$("input[type='button']").attr("disabled",false);
	
	
}

$("#run_saved_query").click(function(){
	var w=200,h=200;
	var left = (screen.width/2)-(w/2);
	var top = (screen.height/2)-(h/2);
	
	var selected_query="query_string="+encodeURIComponent($("#saved_queries").val());
	window.open ("admin/QueryResults.jsp"+"?"+selected_query, "Query Results", 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);
	
	
	
	
});

$("#clear_button").click(function(){
	reload();
});//end of clear_button click

});//end of ready


</script>
<script>
function popupresults(w,h) {
	$("#sql_query").trigger("click");
	var left = (screen.width/2)-(w/2);
	var top = (screen.height/2)-(h/2);
	var query_modified="query_string="+encodeURIComponent(query);
	var targetWin = window.open ("admin/QueryResults.jsp"+"?"+query_modified, "Query Results", 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);
	}

function reload(){

window.location.href=window.location.href;
}
</script>
</head>
<body>
<p id="paragraph">Query String for filtering: <input type="text" id="query_string" name="query_string" placeholder="column1=2 AND column2=3" size="110"/>


<input type="button" value="Save" id="save_button"/>
<input type="button" value="Run Query" id="run_query_button" onclick="popupresults(200,200)"/>
<input type="button" value="New" id="clear_button"/>
<input type="button" value="SQL" id="sql_query" style="display:none"/>

<br>
<form action="admin/QueryResults.jsp" method="post" id="saved_query_form">
Saved Queries: <select id="saved_queries" name="query_string">
<s:iterator value="saved_queries">
<option value="<s:property/>"><s:property/>

</option>
</s:iterator>
</select>
<input type="button" id="run_saved_query" value="Run Saved Query"/>

</form>
</p>


<br>
<table align="center" border="1" id="connectors">
<tr>
<td>
<input type="button" value="(" id="left_par"/>
</td>
<td>
<input type="button" value=")" id="right_par"/>
</td>


<td>
<input type="button" value="AND" id="and"/>
</td>
<td>
<input type="button" value="OR" id="or"/>
</td>


</tr>


</table>
<table border="1" id="filters" align="right">
<tr><th>Specify filtering condition:</th></tr>
<tr><Td>Column Name:<b><span id="selected_column"></span></b></td></tr>
<tr><td>Condition:
<select id="condition">
<option value=">=">&gt;=</option>
<option value="<=">&lt;=</option>
<option value=">">&gt;</option>
<option value="<">&lt;</option>
<option value="=">=</option>
<option value="like">LIKE</option>

</select></td></tr>
<tr><td>Value:<input type="text" id="condition_value"/><span class="required"></span></td></tr>
<tr><td><input type="button" value="Add to filter query" id="add_to_filter"/></td></tr>



</table>
<table border="1" id="table0" align="left">
<tr><th>Tables</th></tr>
<s:iterator value="arr">
<tr><td>
<s:property/>
</td>
</tr>
</s:iterator>


</table>
<table border="1" id="table1" align="left">
<tr class="header"><th>Table Columns</th></tr>


</table>

<input type="button" value="add" id="b1"/>
<input type="button" value="remove" id="b2"/>
<table border="1" id="table2">
<tr class="header"><Th>Interested Columns</th></tr>
</table>
</body>
</html>
